<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%-- <base href="${ctx}" /> --%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>线上订单</title>
<link href="${ctx}/static/bootstrap/css/bootstrap.min.css"
	rel="stylesheet" type="text/css" />
<link href="${ctx}/static/dist/css/font-awesome.min.css"
	rel="stylesheet" type="text/css" />
<link href="${ctx}/static/plugins/datatables/css/matrix-style.css"
	rel="stylesheet" type="text/css" />
<link href="${ctx}/static/dist/css/AdminLTE.css" rel="stylesheet"
	type="text/css" />
<link href="${ctx}/static/plugins/layer/skin/default/layer.css"
	rel="stylesheet" type="text/css" />
<link
	href="${ctx}/static/plugins/datatables/css/dataTables.bootstrap.css"
	rel="stylesheet" type="text/css" />
<style>
button.searching {
	background-color: #666
}
</style>

</head>
<body>
	<div class="widget-box">
		<div class="widget-title">
			<h5>请输入查询条件</h5>
		</div>
		<div class="widget-content nopadding">
			<table style="line-height:45px;font-size:12px;">
				<tr>
					<td>&nbsp;&nbsp;&nbsp;订单号：</td>
					<td><input type="text" class="form-control" name="orderNo"
						id="orderNo" style="width:200px;" placeholder="请输入你的信息"></td>
					<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-success"
						href="javascript:void(0);" onclick="query();">查 询</a>
					</td>
					<!-- <td>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-primary" href="/api/unLineOrderProfit/exportunlinemanagerprofit" id="exportExcel">导出数据</a>
				</td> -->
				</tr>
			</table>
			<div id="area_div" style="margin-left: 10px"></div>
		</div>
	</div>
	<div class="row">
		<div class="col-xs-12">
			<div class="box">
				<div class="box-header">
					<h3 class="box-title">线上订单列表</h3>
				</div>
				<!-- 列表 -->
				<div class="box-body table-responsive">
					<table id="dataTables" class="table table-bordered table-hover">
					</table>
				</div>
			</div>
		</div>
	</div>

	<!-- 发货 -->
	<div class="addr_form" id="sendProduct" style="display:none;">
		<form class="form-horizontal" id="shippingForm"
			style="margin-top: 40px;">
			<div class="form-group">
				<label for="" class="col-sm-1 control-label"><span
					class="red">*</span>发货地址:</label>
				<div class="col-sm-3">
					<select id="sendAddressId" name="sendAddressId"
						class="form-control validate[required]">
					</select>
				</div>
			</div>
			<div class="form-group">
				<label for="" class="col-sm-1 control-label"><span
					class="red">*</span>物流公司:</label>
				<div class="col-sm-3">
					<input type="text" class="form-control validate[required]"
						maxlength="50" id="logisticName" name="logisticName"
						placeholder="物流公司" />
				</div>
			</div>

			<div class="form-group">
				<label for="phone" class="col-sm-1 control-label"><span
					class="red">*</span>物流编号:</label>
				<div class="col-sm-4">
					<input type="text" class="form-control validate[required]"
						maxlength="50" id="logisticNo" name="logisticNo"
						placeholder="物流编号" />
				</div>
			</div>
			<div class="form-group">
				<div class="edit_btn">
					<button type="button" class="btn btn-primary"
						onclick="sendProduct();" id="addAddress">发货</button>
					<button type="button" class="btn btn-danger" id="cancel"
						onclick="closeLayer()">取消</button>
				</div>
			</div>
			<input type="hidden" id="id" name="id" /> <input type="hidden"
				id="supplierId" name="supplierId">
			<!-- <input type="hidden" id="status" name="status"> -->
		</form>
	</div>

	<script src="${ctx}/static/plugins/jQuery/jQuery-2.1.4.min.js"></script>
	<script src="${ctx}/static/bootstrap/js/bootstrap.min.js"></script>
	<!-- datatable -->
	<script src="${ctx}/static/plugins/datatables/jquery.dataTables.js"
		type="text/javascript"></script>
	<script src="${ctx}/static/plugins/datatables/dataTables.bootstrap.js"
		type="text/javascript"></script>
	<script src="${ctx}/static/plugins/layer/layer.js"
		type="text/javascript"></script>
	<script src="${ctx}/static/js/common/area.js" type="text/javascript"></script>
	<script src="${ctx}/static/js/common/common.js" type="text/javascript"></script>
	<script>
		var tb;
		$(function() {
			//列表初始化
			tb = $('#dataTables')
					.dataTable(

							{
								"bServerSide" : true,
								"sPaginationType" : "full_numbers",
								"bJQueryUI" : true,
								"sDom" : '<"">t<"F"ip>',
								"sAjaxSource" : "/api/order/listonlineorder", //ajax调用接口
								"aoColumnDefs" : [ {
									sDefaultContent : '',
									aTargets : [ '_all' ]
								} ],
								"aoColumns" : [
										{
											"sTitle" : "序号",
											"mData" : "id",
											"class" : "sClass"
										},
										{
											"sTitle" : "供应商id",
											"mData" : "supplierId",
											"class" : "sClass",
											"bVisible" : false
										},
										{
											"sTitle" : "订单号",
											"mData" : "orderNo",
											"class" : "sClass"
										},
										{
											"sTitle" : "供应商名称",
											"mData" : "supplierName",
											"class" : "sClass"
										},
										{
											"sTitle" : "供应商电话",
											"mData" : "supplyerTel",
											"class" : "sClass"
										},
										{
											"sTitle" : "商品名称",
											"mData" : "productName",
											"class" : "sClass"
										},
										{
											"sTitle" : "下单时间",
											"mData" : "deliveryDate",
											"class" : "sClass"
										},
										{
											"sTitle" : "联系人",
											"mData" : "contact",
											"class" : "sClass"
										},
										{
											"sTitle" : "联系电话",
											"mData" : "telPhone",
											"class" : "sClass"
										},
										{
											"sTitle" : "商品金额",
											"mData" : "price",
											"class" : "sClass"
										},
										{
											"sTitle" : "数量",
											"mData" : "num",
											"class" : "sClass"
										},
										{
											"sTitle" : "物流费用",
											"mData" : "postage",
											"class" : "sClass"
										},
										{
											"sTitle" : "订单总额",
											"mData" : "payMoney",
											"class" : "sClass"
										},
										{
											"sTitle" : "详细地址",
											"mData" : "addrDetail",
											"class" : "sClass"
										},
										{
											"sTitle" : "订单状态",
											"mData" : "status",
											"class" : "sClass",
											"mRender" : function(data, type,
													full) {
												var text;
												var status = full.status;
												switch (status) {
												//状态(1待付款，2待发货，3已发货，4交易完成，5交易关闭，6退款中，7已退货)
												case 1:
													text = "待付款";
													break;
												case 2:
													text = "待发货";
													break;
												case 3:
													text = "已发货";
													break;
												case 4:
													text = "交易完成";
													break;
												case 5:
													text = "交易关闭";
													break;
												case 6:
													text = "退款中";
													break;
												case 7:
													text = "已退货";
													break;
												}
												return text;
											}
										},
										{
											"sTitle" : "操作",
											"mData" : "id",
											"mRender" : function(data, type,
													full) {
												var text = '<div class="btn-group" style="text-align:left;"><button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">操作 <span class="caret"></span></button>';
												text = text
														+ '<ul class="dropdown-menu" role="menu">';
												text += '<li class="divider"></li>';
												text += '<li><a href="/api/order/getorderdetail?id='
														+ full.id
														+ '">订单详情</a> </li>';
												text += '<li class="divider"></li>';
												if (${login_back_session.sessionRoleVo[0].roleCode ==2}) {

													text += '<li><a href="javascript:void(0);" onclick="initSendProduct(\''
															+ full.id
															+ '\',\''
															+ full.supplierId
															+ '\',\''
															+ full.status
															+ '\');">发货</a> </li>';
													text += '<li class="divider"></li>';
												}
												return text;
											}
										} ],
								"oLanguage" : {
									"sProcessing" : "数据加载中······",
									"sLengthMenu" : "显示 _MENU_ 条记录",
									"sZeroRecords" : "没有您要搜索的内容！",
									"sEmptyTable" : "列表中无数据存在！",
									"sInfo" : "当前显示 _START_ 到 _END_ 条数据，共 _TOTAL_ 条数据",
									"sInfoEmpty" : "显示 0 到 0 条记录",
									"sInfoFiltered" : "数据列表中共  _MAX_ 条记录",
									"oPaginate" : {
										"sFirst" : "首页",
										"sPrevious" : "上一页",
										"sNext" : "下一页",
										"sLast" : "末页"
									}
								},
								"fnServerData" : function(sSource, aoData,
										fnCallback, oSettings) {
									oSettings.jqXHR = $
											.ajax({
												"dataType" : 'json',
												"type" : "GET",
												"async" : 'false',
												"url" : sSource,
												"data" : {
													'pageNum' : (aoData[3].value / aoData[4].value) + 1,
													'pageSize' : aoData[4].value,
													'orderNo' : $("#orderNo").val(),
												},
												"success" : fnCallback
											});
								}
							});

		});

		//条件查询重新加载数据
		function query() {
			tb.fnDraw();
		}

		function initSendProduct(id, supplierId, status) {
			/* var state = $("#status").val(); */
			if (status == 3) {
				layer.alert("已发货,请勿重复操作!");
				var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
				parent.layer.close(index);
				// closeLayer();
				return;
			}
			if (status != 2) {
				var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
				parent.layer.close(index);
				layer.alert("该状态不能发货!");
				// closeLayer();
				return;
			}

			$("#logisticNo").val("");
			$("#logisticName").val("");
			$("#supplierId").val("");
			$("#id").val("");
			/* $("#status").val(""); */
			$("#sendAddressId").empty();
			layer.open({
				title : "订单发货",
				type : 1,
				closeBtn : false,
				resize : false,
				area : [ '750px', '400px' ], // 宽高
				content : $("#sendProduct")
			});

			$("#id").val(id);
			$("#supplierId").val(supplierId);
			//查询区域
			$("#sendAddressId").empty();
			var url = "/api/order/getuseraddress";
			$.post(url, function(data) {
				var list = data.data;
				for (var i = 0; i < list.length; i++) {
					$("#sendAddressId").append(
							"<option value='" + list[i].sendAddressId + "'>"
									+ list[i].address + "</option>");
				}
			});
			/* $("#status").val(status); */
		}

		function closeLayer() {
			layer.closeAll();
		}
		// 发货
		function sendProduct() {
			var sendAddressId = $("#sendAddressId").val();
			if (!sendAddressId) {
				layer.alert("发货地址不能为空!");
				return;
			}

			var logisticName = $("#logisticName").val();
			if (!logisticName) {
				layer.alert("物流公司不能为空!");
				return;
			}

			var logisticNo = $("#logisticNo").val();
			if (!logisticNo) {
				layer.alert("物流公司不能为空!");
				return;
			}

			var data = {
				status : 3,
				logisticName : $("#logisticName").val(),
				logisticNo : $("#logisticNo").val(),
				orderId : $("#id").val()
			}
			$.ajax({
				url : "/api/order/tosend",
				type : "post",
				dataType : "json",
				data : data,
				success : function(json) {
					if (json.code == 200) {
						$("#dataTables").DataTable().fnDraw();
						layer.alert("发货成功", {
							yes : function() {
								closeLayer();
							}
						});
						/*setTimeout(function() {

						}, 5000);*/
					}
				},
				error : function(rr) {
					layer.alert("服务器繁忙,请稍后再试!");
				}
			});
		}
	</script>
</body>
</html>